import React from 'react'
import { Button, Form, Input } from 'antd';

export default function MyFormTestV1() {

  const [form] = Form.useForm();

  const onFinish = values => {
    const formData = form.getFieldsValue([['username', 'password']]);
    console.log(formData);
    return formData;
  }

  const onFinishFailed = values => {

  }

  
  const submitHandler = () => {
    const formData = form.getFieldsValue(['username']);
    console.log(formData);
  }

  return (
    <div>
      <Form
        form={form}
        name="basic"
        labelCol={{ span: 8 }}
        wrapperCol={{ span: 16 }}
        style={{ maxWidth: 600 }}
        initialValues={{ remember: true }}
        onFinish={onFinish}
        onFinishFailed={onFinishFailed}
        autoComplete="off"
      >
        <Form.Item
          label="用户名"
          name="username"
          rules={[{ required: true, message: 'Please input your username!' }]}
        >
          <Input />
        </Form.Item>

        <Form.Item
          label="密码"
          name="password"
          rules={[{ required: true, message: 'Please input your password!' }]}
        >
          <Input.Password />
        </Form.Item>
      </Form>

      <Button type="primary" onClick={submitHandler}>提交</Button>

    </div>
  )
}
